<template>
    <el-card shadow="never" class="card-border-none">
        <el-form :model="form" size="default" label-width="160px" id="list-table">
            <el-form-item label="物流查询key">
                <div>
                    <el-input v-model="form.ship" style="width: 100%;" placeholder="appkey"></el-input>
                    <small style="color:#6b7280;display:block">用于查询物流信息，<a target="_blank" href="https://www.jisuapi.com/api/express/">接口申请（仅供参考）</a></small>
                </div>
            </el-form-item>
            <el-form-item v-permission="['setSysSetting,POST']">
                <el-button type="primary" @click="submit">保存</el-button>
            </el-form-item>
        </el-form>
    </el-card>
</template>
<script setup>
import { ref,reactive,onMounted } from 'vue'
import { showLoading,hideLoading,toast } from '~/composables/util'
import { 
    getSysconfig,
    setSysconfig,
} from '~/api/sysconfig'

const activeName = ref("first")
const form = reactive({
    ship:""
})

function getData(){
    showLoading('#list-table')
    getSysconfig().then(d=>{
        for (const k in form) {
            form[k] = d[k]
        }
    }).finally(()=>{
        hideLoading('#list-table')
    })
}

onMounted(()=>getData())

const submit = ()=>{
    showLoading('#list-table')
    setSysconfig(form).then(res=>{
        toast("修改成功")
        getData()
    }).finally(()=>{
        hideLoading('#list-table')
    })
}
</script>
<style lang="scss" scoped>
.card-border-none {
    border: none;
}
:deep(.el-card__body) {
    background: #fff;
    border-radius: 4px;
}
</style>